import React from 'react';
import { Row, Col, Button, message } from 'antd';
import {
    WeaLocaleProvider,
    WeaDialog,
    WeaRightMenu,
    WeaMoreButton,
    WeaFormItem,
    WeaSelect,
    WeaBrowser,
    WeaCheckbox,
    WeaInputNumber,
    WeaTools,
} from 'ecCom';

const getLabel = WeaLocaleProvider.getLabel;

class Add extends React.Component {
    componentWillMount() {
        this.getYyfqData();
    }

  constructor(props) {
    super(props);
    this.state = {
      visible: props.visible || false,
      title: props.title || getLabel(611, '添加'),
        valueFlag: false,
      data: {
        sharetype: '1',
        sharevalue: '',
        isIncludeSub: '0',
        sharelevel: '0',
        appointvalue: '',
        securityminlevel: 0,
        securitymaxlevel: 100,
      },

    };
    this.getButtons = this.getButtons.bind(this);
    this.getRightMenus = this.getRightMenus.bind(this);
    this.onCancel = this.onCancel.bind(this);
    this.onLoad = this.onLoad.bind(this);
    this.onShareTypeChange = this.onShareTypeChange.bind(this);
    this.onChange = this.onChange.bind(this);
    this.onSave = this.onSave.bind(this);
      this.getYyfqData = this.getYyfqData.bind(this);
  }

  componentWillReceiveProps(nextProps) {
      const { title } = nextProps;
      if (title) {
          this.setState({ title });
      }
  }

  render() {
    const { visible, title, data, valueFlag } = this.state;
    const { sharetype, isIncludeSub, sharelevel, securityminlevel, securitymaxlevel } = data;

    const colProps = { labelCol: { span: 6 }, wrapperCol: { span: 18 } };

    return (
      <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@3mzzj9`}
        visible={visible}
        title={title}
        icon="icon-coms-portal"
        iconBgcolor="#1a57a0"
        style={{ width: 500 }}
        buttons={this.getButtons()}
        onCancel={this.onCancel}
      >
        <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@2gozul`} datas={this.getRightMenus()}>
          <div className="wea-portal-share-add">
            <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@bry885`} label={getLabel(21956, '对象类型')} {...colProps}>
                {
                    valueFlag == true ? <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@jintk2`}
                      style={{ width: '150px' }}
                      options={[
                            { key: '1', showname: getLabel(179, '人力资源') },
                            { key: '2', showname: getLabel(33553, '分部') },
                            { key: '3', showname: getLabel(27511, '部门') },
                            { key: '6', showname: getLabel(122, '角色') },

                            { key: '8', showname: getLabel(6086, '岗位') },
                        ]}
                      value={sharetype}
                      onChange={value => this.onShareTypeChange(value)}
                    /> : <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@v1u3x0`}
                      style={{ width: '150px' }}
                      options={[
                            { key: '1', showname: getLabel(179, '人力资源') },
                            { key: '2', showname: getLabel(33553, '分部') },
                            { key: '3', showname: getLabel(27511, '部门') },
                            { key: '6', showname: getLabel(122, '角色') },
                            { key: '7', showname: getLabel(1340, '所有人') },
                            { key: '8', showname: getLabel(6086, '岗位') },
                        ]}
                      value={sharetype}
                      onChange={value => this.onShareTypeChange(value)}
                    />
                }
            </WeaFormItem>
            {sharetype !== '7' && (
              <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@xr3qh1`} label={getLabel(106, '对象')} {...colProps}>
                {sharetype === '1' && (
                  <WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@gfu7kx`} title={getLabel(516509, '多人力资源')} type={17} key={17} icon={'icon-coms-hrm'} iconBgcolor={'#217346'} isSingle={false} viewAttr={3} onChange={ids => this.onChange('sharevalue', ids)} />
                )}
                {sharetype === '2' && (
                  <Row ecId={`${this && this.props && this.props.ecId || ''}_Row@fm0pwo`} gutter={16}>
                    <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@x95wig`} span={16}>
                      <WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@lxu65k`}
                        key={194}
                        title={getLabel(516508, '多分部')}
                        type={194}
                        icon={'icon-coms-hrm'}
                        iconBgcolor={'#217346'}
                        isSingle={false}
                        tabs={[
                          { key: '1', name: getLabel(384541, '按组织架构'), selected: false },
                          { key: '2', name: getLabel(130619, '按列表'), selected: false, dataParams: { list: 1 }, isSearch: true },
                        ]}
                        viewAttr={3}
                        onChange={ids => this.onChange('sharevalue', ids)}
                      />
                    </Col>
                    <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@2wbenp`} span={8}>
                      <WeaCheckbox ecId={`${this && this.props && this.props.ecId || ''}_WeaCheckbox@k9bgw4`} value={isIncludeSub} content={getLabel(125963, '含下级')} onChange={value => this.onChange('isIncludeSub', value)} />
                    </Col>
                  </Row>
                )}
                {sharetype === '3' && (
                  <Row ecId={`${this && this.props && this.props.ecId || ''}_Row@rpt3af`} gutter={16}>
                    <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@2bp1pe`} span={16}>
                      <WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@v89c9x`}
                        key={57}
                        title={getLabel(516507, '多部门')}
                        type={57}
                        icon={'icon-coms-hrm'}
                        iconBgcolor={'#217346'}
                        isSingle={false}
                        tabs={[
                          { key: '1', name: getLabel(384541, '按组织架构'), selected: false },
                          { key: '2', name: getLabel(130619, '按列表'), selected: false, dataParams: { list: 1 }, isSearch: true },
                        ]}
                        viewAttr={3}
                        onChange={ids => this.onChange('sharevalue', ids)}
                      />
                    </Col>
                    <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@kftdq0`} span={8}>
                      <WeaCheckbox ecId={`${this && this.props && this.props.ecId || ''}_WeaCheckbox@q1s0dj`} value={isIncludeSub} content={getLabel(125963, '含下级')} onChange={value => this.onChange('isIncludeSub', value)} />
                    </Col>
                  </Row>
                )}
                {sharetype === '6' && (
                  <WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@jstgde`} title={getLabel(122, '角色')} key={267} quickSearchName={'rolesmark'} type={267} iconBgcolor={'rgb(179, 46, 55)'} isSingle={true} viewAttr={3} onChange={ids => this.onChange('sharevalue', ids)} />
                )}
                {sharetype === '8' && (
                  <WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@18ec8t`} title={getLabel(516510, '多岗位')} key={278} type={278} isSingle={false} viewAttr={3} onChange={ids => this.onChange('sharevalue', ids)} />
                )}
              </WeaFormItem>
            )}
            {sharetype === '6' && (
              <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@34it5d`} label={getLabel(21958, '角色级别')} {...colProps}>
                <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@0466nu`}
                  style={{ width: '150px' }}
                  options={[
                    { key: '0', showname: getLabel(27511, '部门') },
                    { key: '1', showname: getLabel(33553, '分部') },
                    { key: '2', showname: getLabel(140, '总部') },
                  ]}
                  value={sharelevel}
                  onChange={value => this.onChange('sharelevel', value)}
                />
              </WeaFormItem>
            )}
            {sharetype === '8' && (
              <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@8rg5fk`} label={getLabel(28169, '岗位级别')} {...colProps}>
                <Row ecId={`${this && this.props && this.props.ecId || ''}_Row@pfk30s`} gutter={16}>
                  <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@mx106o`} span={8}>
                    <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@argm1j`}
                      style={{ width: '150px' }}
                      options={[
                        { key: '0', showname: getLabel(140, '总部') },
                        { key: '1', showname: getLabel(19437, '指定分部') },
                        { key: '2', showname: getLabel(19438, '指定部门') },
                      ]}
                      value={sharelevel}
                      onChange={value => this.onChange('sharelevel', value)}
                    />
                  </Col>
                  <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@xpgxtm`} span={16}>
                    {sharelevel === '1' && (
                      <WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@im4hbj`}
                        key={194}
                        title={getLabel(516508, '多分部')}
                        type={194}
                        icon={'icon-coms-hrm'}
                        iconBgcolor={'#217346'}
                        isSingle={false}
                        tabs={[
                          { key: '1', name: getLabel(384541, '按组织架构'), selected: false },
                          { key: '2', name: getLabel(130619, '按列表'), selected: false, dataParams: { list: 1 }, isSearch: true },
                        ]}
                        viewAttr={3}
                        onChange={ids => this.onChange('appointvalue', ids)}
                      />
                    )}
                    {sharelevel === '2' && (
                      <WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@58pdbp`}
                        key={57}
                        title={getLabel(516507, '多部门')}
                        type={57}
                        icon={'icon-coms-hrm'}
                        iconBgcolor={'#217346'}
                        isSingle={false}
                        tabs={[
                          { key: '1', name: getLabel(384541, '按组织架构'), selected: false },
                          { key: '2', name: getLabel(130619, '按列表'), selected: false, dataParams: { list: 1 }, isSearch: true },
                        ]}
                        viewAttr={3}
                        onChange={ids => this.onChange('appointvalue', ids)}
                      />
                    )}
                  </Col>
                </Row>
              </WeaFormItem>
            )}
            {sharetype !== '1' && sharetype !== '8' && (
              <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@ifyfaz`} label={getLabel(683, '安全级别')} {...colProps}>
                <WeaInputNumber ecId={`${this && this.props && this.props.ecId || ''}_WeaInputNumber@65a1a9`} value={securityminlevel} onChange={value => this.onChange('securityminlevel', value)} />
                <span style={{ display: 'inline-block', width: '10px', textAlign: 'center' }}>-</span>
                <WeaInputNumber ecId={`${this && this.props && this.props.ecId || ''}_WeaInputNumber@3j4gr5`} value={securitymaxlevel} onChange={value => this.onChange('securitymaxlevel', value)} />
              </WeaFormItem>
            )}
          </div>
        </WeaRightMenu>
      </WeaDialog>
    );
  }

    /* 获取是否禁用“所有人”权限范围 */
    getYyfqData() {
        WeaTools.callApi('/api/hrm/common/appDetachDisableAll', 'get').then((result) => {
            if (result.status == true) {
                this.setState({
                    valueFlag: result.appDetachDisableAll,
                });
            }
        });
    }
  getButtons() {
    const buttons = [];
    buttons.push(
      <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@s0ow08`} type="primary" onClick={this.onSave}>
        {getLabel(30986, '保存')}
      </Button>,
    );
    buttons.push(<WeaMoreButton ecId={`${this && this.props && this.props.ecId || ''}_WeaMoreButton@7nqn0g`} datas={this.getRightMenus()} />);
    return buttons;
  }

  getRightMenus() {
    const rightMenus = [];
    rightMenus.push({ key: '1', icon: <i className="icon-coms-Preservation" />, content: getLabel(30986, '保存'), onClick: this.onSave });
    return rightMenus;
  }

  onCancel() {
    this.setState({
      visible: false,
      data: {
        sharetype: '1',
        sharevalue: '',
        isIncludeSub: '0',
        sharelevel: '0',
        appointvalue: '',
        securityminlevel: 0,
        securitymaxlevel: 100,
      },
    });
  }

  onLoad() {
    this.setState({ visible: true });
  }

  onShareTypeChange(sharetype) {
    this.setState({
      data: {
        sharetype,
        sharevalue: '',
        isIncludeSub: '0',
        sharelevel: '0',
        appointvalue: '',
        securityminlevel: 0,
        securitymaxlevel: 100,
      },
    });
  }

  onChange(key, value) {
    const { data = {} } = this.state;
    this.setState({
      data: { ...data, [key]: value },
    });
  }

  onSave() {
    const { data = {} } = this.state;
    const { sharetype, sharevalue, sharelevel, appointvalue } = data;
    if ((sharetype !== '7' && !sharevalue.trim()) || (sharetype === '8' && sharelevel !== '0' && !appointvalue.trim())) {
      message.warning(getLabel(15859, '必要信息不完整！'));
    } else {
      this.props.onSave(data);
    }
  }
}

export default Add;
